import { Timeline, Animation } from "./animation.js";
import { ease, easeIn, easeOut } from './ease.js'

let tl = new Timeline();

tl.start();

// 因为直接传数值是不行的，需要 一个模板 转换一下单位
tl.add(new Animation(
  document.querySelector('#el').style,
  "transform", 0, 1000, 2000, 0, ease,
  v => `translateX(${v}px)`
));

document.querySelector('#pause-btn').addEventListener('click', () => tl.pause());

document.querySelector('#resume-btn').addEventListener('click', () => tl.resume());

document.querySelector('#reset-btn').addEventListener('click', () => {
  tl.reset()
  tl.start();
});